<template>
  <a-spin :spinning="loading">
    <a-form-model v-bind="layout" :model="formTwo" ref="nodeFormTwo" :rules="rulesTwo">
      <a-form-model-item label="分配类型" prop="assignType">
        <a-radio-group v-model="formTwo.assignType">
          <a-radio value="1">人员</a-radio>
          <a-radio value="0">
            部门角色
            <a-tooltip title="所选部门下的角色人员可参与此节点任务，至少选择一个；只选部分，则所选部门下的所有人员可参与此节点任务；只选角色，则所选角色的相关人可参与此节点任务">
              <a-icon type="question-circle" />
            </a-tooltip>
            <a-radio value="2">创建人</a-radio>

          </a-radio>
        </a-radio-group>
      </a-form-model-item>
      <template v-if="formTwo.assignType==='0'">
        <a-form-model-item label="参与部门" prop="departs">
          <j-select-depart v-model="formTwo.departs" :multi="true"></j-select-depart>
        </a-form-model-item>
        <a-form-model-item label="参与角色" prop="roles">
          <a-select
                  mode="multiple"
                  placeholder="请选择角色"
                  optionFilterProp = "children"
                  v-model="formTwo.roles">
            <a-select-option v-for="(role,roleindex) in roleList" :key="roleindex.toString()" :value="role.id">
              {{ role.roleName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
      </template>
      <a-form-model-item v-if="formTwo.assignType==='1'" label="参与人员" prop="users">
        <j-select-user-by-dep v-model="formTwo.users" :multi="true"></j-select-user-by-dep>
      </a-form-model-item>
    </a-form-model>
  </a-spin>
</template>

<script>
  import {getAction, postAction} from "../../../api/manage";
  import {queryall } from '@/api/api'

  export default {
    name: "StepTwo",
    props: ['layout', 'nodeId','workflowId', 'defaultAssignType'],
    data() {
      return {
        loading: false,
        formTwo: {
          assignType: '0',
          departs: '',
          users:'',
          roles:[],
        },
        roleList:[],
        rulesTwo: {
          users: [{required: true, message: '请选择人员', trigger: 'blur'}]
        },
      }
    },
    created() {
      if (this.defaultAssignType) {
        this.formTwo.assignType = this.defaultAssignType
      } else {
        this.formTwo.assignType = '0'
      }
      if ('add' != this.type) {
        this.queryInfo()
      }
      this.initialRoleList();
    },
    methods: {
      initialRoleList(){
        queryall().then((res)=>{
          if(res.success){
            this.roleList = res.result;
          }
        });
      },
      //查询回显信息
      queryInfo() {
        this.loading = true;
        getAction('sys/workflowNode/selectChildNodeDeptOrPersonAssign', {nodeId: this.nodeId, type: this.formTwo.assignType})
          .then(res => {
            if (res.success) {
              if(this.formTwo.assignType == 0){
                const {departs,roles} = res.result;
                departs?this.formTwo.departs =  departs.map(item => item.assignInfo).join(','):null;
                roles?this.formTwo.roles =  roles.map(item => item.assignInfo):null;
              }else{
                const {users} = res.result;
                users?this.formTwo.users =  users.map(item => item.assignInfo).join(','):null;
              }
            }else{
              this.$message.error(res.message);
            }
          }).catch(error => console.log(error))
          .finally(() => {
            this.loading = false;
          })
      },
      //保存第二步骤信息
      saveStepTwoInfo() {
        this.$refs.nodeFormTwo.validate(validate => {
          if (validate) {
            // 校验部门或角色至少选择一个
            const assignType = this.formTwo.assignType;
            let assignList = {};
            const {departs,roles,users} = this.formTwo;
            if(assignType === '0'){
              if((!departs || departs.length === 0) && (!roles || roles.length === 0) ){
                this.$warning({
                  content:'部门和角色至少选择一项'
                });
                return false;
              }
              if(departs && departs.length){
                assignList.departs = departs.split(',');
                assignList.roles = roles;
              }
            }else{
              assignList = {
                users:users.split(',')
              }
            }
            this.loading = true;
            const params = {
              assignType: assignType,
              assignList: assignList,
              nodeId: this.nodeId,
              workflowId: this.workflowId
            };
            postAction('sys/workflowNode/childNodeAssignDeptAndPerson', params).then(res => {
              if (res.success) {
                this.$emit('saveSuccess')
              } else {
                this.$message.error(res.message);
              }
            }).catch(error => {
              console.log(error)
            }).finally(() => {
              this.loading = false;
            })
          } else {
            return false;
          }
        })
      },
    }
  }
</script>

<style scoped>
  .warn {
    font-size: 12px;
    color: red;
  }
</style>
